<template>
  <el-card class="box-card">
    <div slot="header" class="clearfix">
      <span>文件列表</span>
    </div>
    <div v-for="exprData in exprDataList" :key="exprData.id" class="text item">
      <el-link type="primary">{{ exprData.filePath }}</el-link>
    </div>
  </el-card>
</template>

<script>
export default {
  // 此处的message是实验id
  props: ["message"],
  data() {
    return {
      exprDataList: [],
    };
  },
  watch: {
    message(newValue) {
      // 通过id拿到数据集
      this.$http({
        url: "expe-data/listByExpeId?expeId=" + newValue,
        method: "get",
      })
        .then((response) => {
          if (response.data.code == 0) {
            this.exprDataList = response.data.data;
          }
        })
        .catch((err) => err);
    },
  },
};
</script>

<style scope>
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}

.box-card {
  width: 480px;
}
</style>